<DOCTYPE html>
<html>
<head>
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
        <style>
        body{
             background-color: pink !important;
        }
        table{
            background-color: blue;
        }
        .zfh1{
          background-color: aqua !important;
        }
        #zfh{
          background-color: green;
        }
    </style>
</head>
<body>
  <p class="zfh1">张峰华的作业</p>
  <p id="zfh" class="zfh1">我到底是什么颜色</p>
        <table class="table">
        <table class="table-bordered">
                <div class="table-bordered">
                <div class="row">
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                        <div class="col-md-1">我是栅格布局</div>
                      </div>
                      <div class="row">
                        <div class="col-md-8">我是栅格布局</div>
                        <div class="col-md-4">我是栅格布局</div>
                      </div>
                      <div class="row">
                        <div class="col-md-4">我是栅格布局</div>
                        <div class="col-md-4">我是栅格布局</div>
                        <div class="col-md-4">我是栅格布局</div>
                      </div>
                      <div class="row">
                        <div class="col-md-6">我是栅格布局</div>
                        <div class="col-md-6">我是栅格布局</div>
                      </div>
            <div class="table-bordered">
        <tr>
            <td>序号</td>
            <td>姓名</td>
            <td>爱好</td>
            <td>性别</td>
            <td>班级</td>
            <td>生日</td>
            <td>学校</td>
        </tr>
        <tr>
                <td>1</td>
                <td>邓宇山</td>
                <td>篮球</td>
                <td>男</td>
                <td>移动互联1802</td>
                <td>12.14</td>
                <td>湖南汽车工程学院</td>
            </tr>
            <tr>
                    <td>2</td>
                    <td>唐赢</td>
                    <td>吉他</td>
                    <td>男</td>
                    <td>移动互联1802</td>
                    <td>11.18</td>
                    <td>湖南汽车工程学院</td>
                </tr>
                <tr>
                        <td>3</td>
                        <td>王南屯</td>
                        <td>动漫</td>
                        <td>男</td>
                        <td>移动互联1801</td>
                        <td>11.20</td>
                        <td>湖南汽车工程学院</td>
                    </tr>
                    <tr>
                            <td>4</td>
                            <td>黎童灵</td>
                            <td>浪</td>
                            <td>女</td>
                            <td>移动互联1802</td>
                            <td>06.29</td>
                            <td>湖南汽车工程学院</td>
                        </tr>
    </table>
</body>
</html>